{layout name="layout1" /}
<div class="layui-fluid">
    <div class="layui-card">
        <div class="layui-tab layui-tab-card" lay-filter="tab-all">
            <ul class="layui-tab-title">
                <li data-type='' class="layui-this">全部</li>
                <li data-type=0>可预约</li>
                <li data-type=1>已有预约</li>
                <li data-type=2>不可预约</li>
            </ul>
            <div class="layui-form layui-card-header layuiadmin-card-header-auto">
                <div class="layui-form-item">
                    <div class="layui-inline">
                        <label class="layui-form-label" style="white-space: nowrap;">完播状态：</label>
                        <div class="layui-input-inline">
                            <select name="finish_status" id="finish_status">
                                <option value="">--请选择--</option>
                                <option value="1">已完成</option>
                                <option value="2">未完成</option>
                            </select>
                        </div>
                    </div>
                    <div class="layui-inline">
                        <label class="layui-form-label" style="white-space: nowrap;">标签：</label>
                        <div class="layui-input-inline">
                            <select name="label" id="label">
                                <option value="">--请选择--</option>
                                {foreach $category as $v}
                                <option value="{$v.id}">{$v.name}</option>
                                {/foreach}
                            </select>
                        </div>
                    </div>

                    <div class="layui-inline">
                        <button class="layui-btn layui-btn-sm layuiadmin-btn-unit {$view_theme_color}" lay-submit
                                lay-filter="TheHost-search">查询
                        </button>
                        <button class="layui-btn layui-btn-sm layui-btn-primary layuiadmin-btn-unit }" lay-submit
                                lay-filter="TheHost-clear-search">清空查询
                        </button>
                    </div>

                </div>
            </div>

            <div class="layui-card-body">
                <div style="padding-bottom: 10px;">
                    <!--<button class="layui-btn layui-btn-sm layuiadmin-btn-unit {$view_theme_color}" data-type="add">新增主播-->
                    <!--</button>-->
                    <!--                <button class="layui-btn layui-btn-sm layuiadmin-btn-unit layui-btn-danger" data-type="batchdel">删除所选</button>-->
                </div>

                <table id="theHost" lay-filter="theHost"></table>

                <script type="text/html" id="TheHost-operation">
                    <a class="layui-btn layui-btn layui-btn-sm" lay-event="schedule">档期</a>
                    <a class="layui-btn layui-btn-normal layui-btn-sm" lay-event="edit">修改</a>
                    <a class="layui-btn layui-btn-danger layui-btn-sm" lay-event="del">删除</a>
                    {{#if(d.status == 0){}}
                    <a class="layui-btn layui-btn layui-btn-sm" lay-event="audit">审核</a>
                    {{# } }}

                </script>
            </div>
        </div>
    </div>
</div>


<script>
    layui.config({
        version: "{$front_version}",
        base: '/static/plug/layui-admin/dist/layuiadmin/' //静态资源所在路径
    }).extend({
        index: 'lib/index' //主入口模块
    }).use(['index', 'like', 'table', 'form'], function () {
            var $ = layui.$
                , form = layui.form
                , table = layui.table
                , like = layui.like
                , element = layui.element;

            getList("");
            //切换列表
            element.on('tab(tab-all)', function (data) {
                var status = $(this).attr('data-type');
                getList(status);
            });

            function getList(status) {
                var url = '{:url("theHost/scheduleList")}?id=' + {$host_id};
                if (status !== "") {
                    url += '&status=' + status
                }
                table.render({
                    id: 'theHost'
                    , elem: '#theHost'
                    , height: 'full-220'
                    , url: url
                    , cols: [[
                        {field: 'id', width: 80, fixed: "left", title: '序号'}
                        , {field: 'schedule', width: 150, title: '档期'}
                        , {
                            field: 'label', width: 250, title: '标签', templet: function (value, row, index) {
                                var l = "";

                                if (value.label_name && value.label_name.length > 0) {
                                    for (var i = 0; i < value.label_name.length; i++) {
                                        l += "<span class=\"layui-badge layui-bg-cyan\">" + value.label_name[i] + "</span>" + "&nbsp;/&nbsp;";
                                    }
                                }
                                return l;
                            }
                        }
                        , {
                            field: 'start_type', width: 250, title: '直播类型/发起类型', templet: function (value, row, index) {
                                var l = "";
                                if (value.live_type == "0") {
                                    l = "<span class=\"layui-btn layui-btn-xs layui-btn-primary layui-border-blue\">混播</span>"
                                } else if (value.live_type == "1") {
                                    l = "<span class=\"layui-btn layui-btn-xs layui-btn-primary layui-border-orange\">专场</span>"
                                }
                                var i = "";
                                if (value.start_type == "0") {
                                    i = "<span class=\"layui-badge layui-bg-gray\">主播发起悬赏</span>"
                                } else if (value.start_type == "1") {
                                    i = "<span class=\"layui-badge layui-bg-green\">商家发起预约</span>"
                                }
                                return l + "&nbsp;/&nbsp;" + i
                            }
                        }

                        , {
                            field: 'status', width: 250, title: '状态/直播平台', templet: function (value, row, index) {
                                var s = "";
                                if (value.status == "0") {
                                    s = "<span class='layui-btn layui-btn-xs layui-btn-normal'>可预约</span>"
                                } else if (value.status == "1") {
                                    s = "<span class='layui-btn layui-btn-xs  layui-btn-warm'>已有预约</span>"
                                } else if (value.status == "2") {
                                    s = "<span class='layui-btn layui-btn-xs  layui-btn-danger'>不可预约</span>"
                                }
                                var i = "";
                                if (value.platform == "0") {
                                    i = "<img style='width: 15px;height: 15px' src='/images/icon/douyinicon.png'>"
                                } else if (value.platform == "1") {
                                    i = "<img style='width: 15px;height: 15px' src='/images/icon/kuaishouicon.png'>"
                                } else if (value.platform == "2") {
                                    i = "<img style='width: 15px;height: 15px' src='/images/icon/tianmaoicon.png'>"
                                }
                                return s + "&nbsp;/&nbsp;" + i
                            }
                        }
                        , {field: 'expect_commission', width: 250, title: '期望佣金比例 / %'}
                        , {field: 'expect_num', width: 250, title: '期望数量'}
                        , {
                            field: 'create_time', width: 250, title: '添加时间', templet: function (value, row, index) {
                                if(value.create_time){
                                    return set_time(value.create_time);
                                }
                                return "";
                            }
                        }
                    ]]
                    , page: true
                    , text: {none: '暂无数据！'}
                    , parseData: function (res) { //将原始数据解析成 table 组件所规定的数据
                        return {
                            "code": res.code,
                            "msg": res.msg,
                            "count": res.data.count, //解析数据长度
                            "data": res.data.lists, //解析数据列表
                        };
                    }
                    , done: function fix(res, curr, count) {
                        $(".layui-table-main tr").each(function (index, val) {
                            $(".layui-table-fixed").each(function () {
                                $($(this).find(".layui-table-body tbody tr")[index]).height($(val).height());
                            });
                        });
                        $(".layui-table-header tr").each(function (index, val) {
                            $(".layui-table-fixed").each(function () {
                                $($(this).find(".layui-table-header thead tr")[index]).height($(val).height());
                            });
                        });
                        // merge(res, curr, count);
                        window.onresize = function () {
                            fix()
                        }

                    }
                });
            }

            function set_time(str) {
                var n = parseInt(str) * 1000;
                var D = new Date(n);
                var year = D.getFullYear();//四位数年份

                var month = D.getMonth() + 1;//月份(0-11),0为一月份
                month = month < 10 ? ('0' + month) : month;

                var day = D.getDate();//月的某一天(1-31)
                day = day < 10 ? ('0' + day) : day;

                var hours = D.getHours();//小时(0-23)
                hours = hours < 10 ? ('0' + hours) : hours;

                var minutes = D.getMinutes();//分钟(0-59)
                minutes = minutes < 10 ? ('0' + minutes) : minutes;

                // var seconds = D.getSeconds();//秒(0-59)
                // seconds = seconds<10?('0'+seconds):seconds;
                // var week = D.getDay();//周几(0-6),0为周日
                // var weekArr = ['周日','周一','周二','周三','周四','周五','周六'];

                var now_time = year + '-' + month + '-' + day + ' ' + hours + ':' + minutes;
                return now_time;
            }

            /**
             * 合并单元格
             * @param res 表格数据
             * @param curr 当前页
             * @param count 总数
             */
            // function merge(res, curr, count) {
            //     var data = res.data;
            //     //alert(JSON.stringify(data));
            //     var mergeIndex = 0;//定位需要添加合并属性的行数
            //     var mark = 1; //这里涉及到简单的运算，mark是计算每次需要合并的格子数
            //     var columsName = ['CusID'];//需要合并的列名称
            //     var columsIndex = [0];//需要合并的列索引值
            //     for (var k = 0; k < columsName.length; k++)//这里循环所有要合并的列
            //     {
            //         mark = 1;
            //         var trArr = $(".layui-table-body>.layui-table").find("tr");//所有行
            //         //这里循环表格当前的数据
            //         for (var i = 1; i < res.data.length; i++) {
            //             var tdCurArr = trArr.eq(i).find("td").eq(columsIndex[k]);//获取当前行的当前列
            //             var tdPreArr = trArr.eq(mergeIndex).find("td").eq(columsIndex[k]);//获取相同列的第一列
            //             //后一行的值与前一行的值做比较，相同就需要合并
            //             if (data[i][columsName[k]] === data[i - 1][columsName[k]]) {
            //                 // alert(data[i][columsName[k]]);
            //                 mark += 1;
            //                 //相同列的第一列增加rowspan属性
            //                 tdPreArr.each(function () {
            //                     $(this).attr("rowspan", mark);
            //                 });
            //                 //当前行隐藏
            //                 tdCurArr.each(function () {
            //                     $(this).css("display", "none");
            //                 });
            //             } else {
            //                 mergeIndex = i;
            //                 mark = 1;//一旦前后两行的值不一样了，那么需要合并的格子数mark就需要重新计算
            //             }
            //         }
            //     }
            //
            //     mergeIndex = 0;//定位需要添加合并属性的行数
            //     mark = 1; //这里涉及到简单的运算，mark是计算每次需要合并的格子数
            //     columsName = ['CusName'];//需要合并的列名称
            //     columsIndex = [1];//需要合并的列索引值
            //     //这里循环所有要合并的列
            //     for (var k = 0; k < columsName.length; k++) {
            //         mark = 1;
            //         var trArr = $(".layui-table-body>.layui-table").find("tr");//所有行
            //         //这里循环表格当前的数据
            //         for (var i = 1; i < res.data.length; i++) {
            //             var tdCurArr = trArr.eq(i).find("td").eq(columsIndex[k]);//获取当前行的当前列
            //             var tdPreArr = trArr.eq(mergeIndex).find("td").eq(columsIndex[k]);//获取相同列的第一列
            //             //后一行的值与前一行的值做比较，相同就需要合并
            //             if (data[i][columsName[k]] === data[i - 1][columsName[k]]) {
            //                 // alert(data[i][columsName[k]]);
            //                 mark += 1;
            //                 tdPreArr.each(function () {
            //                     $(this).attr("rowspan", mark);//相同列的第一列增加rowspan属性
            //                 });
            //                 //当前行隐藏
            //                 tdCurArr.each(function () {
            //                     $(this).css("display", "none");
            //                 });
            //             } else {
            //                 mergeIndex = i;
            //                 mark = 1;//一旦前后两行的值不一样了，那么需要合并的格子数mark就需要重新计算
            //             }
            //         }
            //     }
            // }

            //监听搜索
            form.on('submit(TheHost-search)', function (data) {
                var field = data.field;
                //执行重载
                table.reload('theHost', {
                    where: field,
                    page: {
                        curr: 1 //重新从第 1 页开始
                    },
                });
            });
            //清空查询
            form.on('submit(TheHost-clear-search)', function () {
                $('#keyword').val('');//清空输入框
                //刷新列表
                table.reload('theHost', {
                    where: []
                });
            });

            //事件
            var active = {
                add: function () {
                    {
                        layer.open({
                            type: 2
                            , title: '新增主播'
                            , content: '{:url("TheHost/add")}'
                            , area: ['60%', '95%']
                            , btn: ['确定', '取消']
                            , yes: function (index, layero) {

                                var iframeWindow = window['layui-layer-iframe' + index]
                                    , submitID = 'TheHost-submit'
                                    , submit = layero.find('iframe').contents().find("#TheHost-submit");
                                //监听提交

                                iframeWindow.layui.form.on('submit(TheHost-submit)', function (data) {
                                    var field = data.field;
                                    {
                                        like.ajax({
                                            url: '{:url("TheHost/add")}',
                                            data: field,
                                            type: "post",
                                            success: function (res) {
                                                if (res.code == 1) {
                                                    layui.layer.msg(res.msg, {
                                                        offset: '15px'
                                                        , icon: 1
                                                        , time: 1000
                                                    });
                                                    layer.close(index); //关闭弹层
                                                    table.reload('theHost'); //数据刷新
                                                } else {
                                                    layer.msg(res.msg, {
                                                        offset: '15px'
                                                        , icon: 2
                                                        , time: 1000
                                                    });
                                                }

                                            }
                                        });
                                    }
                                });
                                submit.trigger('click');
                            },

                        })
                    }
                }

                , batchdel: function () {
                    //删除所选
                    var checkStatus = table.checkStatus('theHost'), checkData = checkStatus.data; //得到选中的数据
                    //是否已选数据
                    if (checkData.length === 0) {
                        return layer.msg('请选择数据');
                    } else {
                        //获取所选id
                        ids = [];
                        for (var i in checkData) {
                            ids.push(checkData[i]['id']);
                        }

                        layer.confirm('确定删除所选主播？', function (index) {
                            like.ajax({
                                url: '{:url("TheHost/del")}',
                                data: {id: ids},
                                type: "post",
                                success: function (res) {
                                    if (res.code == 1) {
                                        layui.layer.msg(res.msg, {
                                            offset: '15px'
                                            , icon: 1
                                            , time: 1000
                                        });
                                        layer.close(index); //关闭弹层
                                        table.reload('theHost'); //数据刷新
                                    } else {
                                        layer.msg(res.msg, {
                                            offset: '15px'
                                            , icon: 2
                                            , time: 1000
                                        });
                                    }
                                }
                            });
                            layer.close(index);
                        });
                    }
                }
            };
            $('.layui-btn.layuiadmin-btn-unit').on('click', function () {
                var type = $(this).data('type');
                active[type] ? active[type].call(this) : '';
            });


            table.on('tool(theHost)', function (obj) {
                if (obj.event === 'del') {
                    var id = obj.data.id;
                    var name = obj.data.true_name;

                    layer.confirm('确定删除主播:<span style="color: cornflowerblue">' + name + "</span>", function (index) {
                        like.ajax({
                            url: '{:url("TheHost/del")}',
                            data: {id: id},
                            type: "post",
                            success: function (res) {
                                if (res.code == 1) {
                                    layui.layer.msg(res.msg, {
                                        offset: '15px'
                                        , icon: 1
                                        , time: 1000
                                    });
                                    layer.close(index); //关闭弹层
                                    table.reload('theHost'); //数据刷新
                                    obj.del();
                                } else {
                                    layer.msg(res.msg, {
                                        offset: '15px'
                                        , icon: 2
                                        , time: 1000
                                    });
                                }
                            }
                        });
                        layer.close(index);
                    });
                } else if (obj.event === 'edit') {
                    var id = obj.data.id;
                    layer.open({
                        type: 2
                        , title: '修改供货商信息'
                        , content: '{:url("TheHost/edit")}?id=' + id
                        , area: ['60%', '90%']
                        , btn: ['确定', '取消']
                        , yes: function (index, layero) {
                            var iframeWindow = window['layui-layer-iframe' + index]
                                , submit = layero.find('iframe').contents().find('#theHost-submit-edit');
                            //监听提交
                            iframeWindow.layui.form.on('submit(theHost-submit-edit)', function (data) {
                                var field = data.field;
                                like.ajax({
                                    url: '{:url("TheHost/edit")}',
                                    data: field,
                                    type: "post",
                                    success: function (res) {
                                        if (res.code == 1) {
                                            layui.layer.msg(res.msg, {
                                                offset: '15px'
                                                , icon: 1
                                                , time: 1000
                                            });
                                            layer.close(index); //关闭弹层
                                            table.reload('theHost'); //数据刷新
                                        }
                                        else {
                                            console.log(2);
                                            layer.msg(res.msg, {
                                                offset: '15px'
                                                , icon: 2
                                                , time: 1000
                                            });
                                        }
                                    }

                                });
                            });
                            submit.trigger('click');
                        }
                    })
                } else if (obj.event === 'audit') {
                    var id = obj.data.id;
                    layer.open({
                        type: 2
                        , title: '主播审核'
                        , content: '{:url("TheHost/audit")}?id=' + id
                        , area: ['60%', '95%']
                        , end: function () {
                            table.reload('theHost'); //数据刷新
                        }
                    })
                } else if (obj.event === 'schedule') {
                    var id = obj.data.id;
                    layer.open({
                        type: 2
                        , title: '主播审核'
                        , content: '{:url("TheHost/scheduleList")}?id=' + id
                        , area: ['60%', '95%']
                        , end: function () {
                            table.reload('theHost'); //数据刷新
                        }
                    })
                }
            });
        }
    );
</script>